<template>
  <div class="center">
    <div class="title">
      <el-row>
        <el-col :span="1" style="width: 50px;">
          <span style="color:#757575;">位置 :</span>
        </el-col>
        <el-col :span="20">
          <span class="hand">{{title}}</span>
        </el-col>
      </el-row>
    </div>
    <div class="posttable">
      <el-row type="flex" justify="center" style="min-height: 50px;
    line-height: 50px;">
        <el-col :span="23">
          <div style="float: left;width:55%;">
            <el-row>
              <el-col style="width: 40px;margin-right: 5px;">
                <h5>搜索 : </h5>
              </el-col>
              <el-col :span="20" class="interviewtrack">
                <el-select size="small" v-model="customername" @change="customerChange" placeholder="请选择客户简称"
                           style="margin-right: 10px;">
                  <el-option v-for="item in customerList" :key="item.id" :label="item.name"
                             :value="item.id"></el-option>
                </el-select>
                <el-select size="small" v-model="no" @change="noChange" placeholder="请选择需求编号"
                           style="margin-right: 10px;">
                  <el-option v-for="item in noList" :key="item" :label="item" :value="item"></el-option>
                </el-select>
                <el-select size="small" v-model="times" @change="timesChange" placeholder="请选择面试次数">
                  <el-option v-for="item in typeList" :key="item" :label="item" :value="item"></el-option>
                </el-select>
              </el-col>
            </el-row>
          </div>
          <div style="float: right;">
            <el-row type="flex" justify="space-between" class="btn">
              <el-input
                size="small"
                style="width: 136px;"
                placeholder="请输入内容"
                v-model.trim="inputValue"
                @keyup.enter.native="searchMsg"
              >
                <i
                  slot="suffix"
                  class="el-input__icon el-icon-search"
                  style="cursor: pointer;"
                  @click="searchMsg"
                ></i>
              </el-input>
              <div style="margin-left: 5px;">
                <el-button
                  class="edit"
                  @mousedown.native="editdown"
                  @mouseup.native="editup"
                  :class="{'active1' : newcolor1}"
                  v-if="jiaofu"
                  size="small"
                  @click="editshow"
                  round
                >修改
                </el-button>
                <el-button
                  class="send"
                  @mousedown.native="sendDown"
                  @mouseup.native="sendUp"
                  v-if="jiaofu"
                  :class="{'active2' : newcolor2}"
                  size="small"
                  round
                  @click="sendBtnClick"
                >发送
                </el-button>
              </div>
            </el-row>
          </div>
        </el-col>
      </el-row>
      <el-row type="flex" justify="center">
        <el-col :span="23">
          <el-table
            ref="singleTable"
            :data="tableData"
            @selection-change="handleSelectionChange"
            :row-key="getRowKey"
            :row-class-name="tableRowClassName"
            class="tableT"
          >
            <el-table-column
              type="selection"
              style="border:1px solid #333"
              :reserve-selection="true"
              width="55">
            </el-table-column>
            <el-table-column prop="name" width="100" label="姓名"></el-table-column>
            <el-table-column prop="customerName" v-if="postCustomer" label="推送客户"></el-table-column>
            <el-table-column prop="postName" label="推送职位"></el-table-column>
            <el-table-column prop="postLevel" label="职位级别"></el-table-column>
            <el-table-column prop="pusher" label="推送人"></el-table-column>
            <el-table-column label="候选人面试时间">
              <template slot-scope="scope">
                <el-tooltip effect="light" :content="scope.row.candidateChangeReason" placement="top"
                            style="margin-right:6px;" v-if="scope.row.candidateChangeReason">
                  <i class="el-icon-info" style="color:#0f98ff;"></i>
                </el-tooltip>
                <span>{{scope.row.candidateTime}}</span>
              </template>
            </el-table-column>
            <el-table-column label="客户面试时间">
              <template slot-scope="scope">
                <el-tooltip effect="light" :content="scope.row.customerChangeReason" placement="top"
                            style="margin-right:6px;" v-if="scope.row.customerChangeReason">
                  <i class="el-icon-info" style="color:#0f98ff;"></i>
                </el-tooltip>
                <span>{{scope.row.customerTime}}</span>
              </template>
            </el-table-column>
            <el-table-column prop="location" width="400" :label="time"></el-table-column>
            <el-table-column prop="interviewerName" label="面试官"></el-table-column>
            <el-table-column prop="interviewerPhone" label="面试官电话"></el-table-column>
          </el-table>
          <div class="pager">
            <el-pagination
              @size-change="handleSizeChange"
              @current-change="pagehandleCurrentChange"
              :current-page="currentPage"
              :page-sizes="[5,10,15]"
              :page-size="pagesize"
              layout="total, sizes, prev, pager, next, jumper"
              :total="totalcount"
            ></el-pagination>
          </div>
        </el-col>
      </el-row>
    </div>
    <el-dialog
      title="修改面试时间"
      class="addP"
      :visible.sync="dialogVisible"
      width="415px"
      :before-close="cancelEdit"
    >
      <div class="contentR">
        <el-form :model="form" class="formList" :rules="rules" ref="formP" label-position="top">
          <el-form-item label="客户修改时间" prop="customerTime">
            <el-date-picker
              v-model="form.customerTime"
              type="datetime"
              placeholder="请选择时间"
              :picker-options="pickerOptions0">
            </el-date-picker>
          </el-form-item>
          <el-form-item label="修改原因" prop="editReason">
            <el-input type="textarea" :rows="4" v-model="form.editReason" placeholder="请输入客户修改时间原因"></el-input>
          </el-form-item>
        </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button class="sure" round @click="editTimePost('formP')">确 定</el-button>
        <el-button round @click="cancelEdit" class="cancel">取 消</el-button>
      </span>
    </el-dialog>
    <el-dialog
      title="完善面试信息"
      class="addP"
      :visible.sync="dialogPerfectVisible"
      width="415px"
      :before-close="cancelPerfect"
    >
      <div class="contentR">
        <el-form :model="formL" class="formList" :rules="rulesL" ref="formL" label-position="top">
          <el-form-item :label="time" prop="area">
            <el-input v-model="formL.area" placeholder="请输入面试地点"></el-input>
          </el-form-item>
          <el-form-item label="面试官">
            <el-input type="textarea" :rows="4" v-model="formL.imployerNames" placeholder="请输入面试官姓名"></el-input>
          </el-form-item>
          <el-form-item label="面试官电话">
            <el-input type="textarea" :rows="4" v-model="formL.phoneNum" placeholder="请输入面试官电话"></el-input>
          </el-form-item>
        </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button class="sure" round @click="perfectPost('formL')">确 定</el-button>
        <el-button round @click="cancelPerfect" class="cancel">取 消</el-button>
      </span>
    </el-dialog>
    <el-dialog
      title="错误"
      :visible.sync="editdialogVisible"
      width="415px"
      :before-close="handleClose"
      class="deletedialog"
    >
      <div style="text-align: center">
        <i class="el-icon-warning" style="font-size: 20px;color: #fcb543;">
          <span style="font-size: 16px;color: #333;margin-left: 12px;">尚未选择任何简历</span>
        </i>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button class="sure" round @click="handleClose">确 定</el-button>
        <el-button round @click="handleClose" class="cancel">取 消</el-button>
      </span>
    </el-dialog>
    <el-dialog
      title="错误"
      :visible.sync="dialogVisibleReason"
      width="415px"
      :before-close="handleCloseR"
      class="deletedialog"
    >
      <div style="text-align: center">
        <i class="el-icon-warning" style="font-size: 20px;color: #fcb543;">
          <span style="font-size: 16px;color: #333;margin-left: 12px;">候选人时间未修改，不得发送邮件</span>
        </i>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button class="sure" round @click="handleCloseR">确 定</el-button>
        <el-button round @click="handleCloseR" class="cancel">取 消</el-button>
      </span>
    </el-dialog>
    <el-dialog
      title="错误"
      :visible.sync="editdialogNoVisible"
      width="415px"
      :before-close="handleNoClose"
      class="deletedialog"
    >
      <div style="text-align: center">
        <i class="el-icon-warning" style="font-size: 20px;color: #fcb543;">
          <span style="font-size: 16px;color: #333;margin-left: 12px;">统一接口人不同!</span>
        </i>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button class="sure" round @click="handleNoClose">确 定</el-button>
        <el-button round @click="handleNoClose" class="cancel">取 消</el-button>
      </span>
    </el-dialog>
    <el-dialog
      title="错误"
      :visible.sync="sendDialogVisible"
      width="415px"
      :before-close="cancel"
      class="deletedialog"
    >
      <div style="text-align: center">
        <i class="el-icon-warning" style="font-size: 20px;color: #fcb543;">
          <span style="font-size: 16px;color: #333;margin-left: 12px;">请每次修改一份简历</span>
        </i>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button class="sure" round @click="confirm">确 定</el-button>
        <el-button round @click="cancel" class="cancel">取 消</el-button>
      </span>
    </el-dialog>
    <el-dialog
      title="错误"
      :visible.sync="giveDialogVisible"
      width="415px"
      :before-close="giveCancel"
      class="deletedialog"
    >
      <div style="text-align: center">
        <i class="el-icon-warning" style="font-size: 20px;color: #fcb543;">
          <span style="font-size: 16px;color: #333;margin-left: 12px;">请每次推送一份放弃或待定的简历</span>
        </i>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button class="sure" round @click="giveCancel">确 定</el-button>
        <el-button round @click="giveCancel" class="cancel">取 消</el-button>
      </span>
    </el-dialog>
    <div class="pager">
      <el-dialog :visible.sync="dialogFormVisible" :before-close="cancelSend" class="back1">
        <div class="dialogBox">
          <el-row>
            <el-col :span="2" style="line-height:28px;color:#0e6195">收件人：</el-col>
            <el-col :span="10" class="receive">
              <span>{{mail}}</span>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="23">
              <div class="line"></div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="2" style="line-height:28px;color:#0e6195">
              抄送人：
            </el-col>
            <el-col :span="18" style="line-height:28px;font-size:12px;"><span v-for="(item,index) in copymail"
                                                                              :key="index">{{item}} <span>,</span></span>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="23">
              <div class="darkline"></div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="2" style="line-height:28px;color:#999798">主&nbsp;&nbsp;&nbsp;&nbsp;题：</el-col>
            <el-col :span="10" style="line-height:28px;font-size:12px;font-weight:700;">
              <el-select v-if="remark" size="mini" filterable v-model="theme" placeholder="请选择主题" @change="themeChange"
                         v-loading="loading">
                <el-option v-for="(item,index) in themeList" :key="index" :label="item" :value="item"></el-option>
              </el-select>
              <el-select v-if="!remark" size="mini" filterable v-model="sendTheme" placeholder="请选择主题"
                         @change="sendThemeChange" v-loading="sendLoading">
                <el-option v-for="(item,index) in sendThemeList" :key="index" :label="item" :value="item"></el-option>
              </el-select>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="23">
              <div class="lightLine"></div>
            </el-col>
          </el-row>
          <el-row style="border: 1px solid #ccc;" class="msyy">
            <el-col :span="12" style="padding-left: 10px;" class="mailtable mailtable1">
              <el-table
                class="tablelist"
                ref="mailtable"
                :data="maildata"
                border
                v-show="times != '二面' && times !='三面' && !isGiveUp"
                :style="{'width' : isGiveUp ? '953px' : '753px'}"
              >
                <el-table-column
                  width="92"
                  prop="name"
                  label="姓名"
                >
                </el-table-column>
                <el-table-column
                  width="200"
                  prop="postName"
                  label="岗位"
                >
                </el-table-column>
                <el-table-column
                  width="230"
                  label="初次候选人面试时间"
                >
                  <template slot-scope="scope">
                    <el-input v-model="scope.row.initialTime" disabled></el-input>
                  </template>
                </el-table-column>
                <el-table-column
                  width="230"
                  :label="label"
                >
                  <template slot-scope="scope">
                    <el-input v-model="scope.row.candidateTime" :disabled="isGiveUp"></el-input>
                  </template>
                </el-table-column>
                <el-table-column
                  width="200"
                  label="原因"
                  v-if="isGiveUp"
                >
                  <template slot-scope="scope">
                    <el-input v-model="scope.row.candidateChangeReason" :disabled="!isGiveUp"></el-input>
                  </template>
                </el-table-column>
              </el-table>
                            <el-table
                              class="tablelist"
                              ref="mailtable"
                              style="width:524px;"
                              :data="maildata"
                              v-show="times == '二面' || times == '三面' && !isGiveUp"
                              border
                            >
                              <el-table-column
                                width="92"
                                prop="name"
                                label="姓名"
                              >
                              </el-table-column>
                              <el-table-column
                                width="200"
                                prop="postName"
                                label="岗位"
                              >
                              </el-table-column>
                              <el-table-column
                                width="230"
                                :label="label"
                              >
                                <template slot-scope="scope">
                                  <el-input v-model="scope.row.candidateTime" :disabled="isGiveUp"></el-input>
                                </template>
                              </el-table-column>
                            </el-table>
                            <el-table
                              class="tablelist"
                              ref="mailtable"
                              style="width:724px;"
                              :data="maildata"
                              v-show="isGiveUp"
                              border
                            >
                              <el-table-column
                                width="92"
                                prop="name"
                                label="姓名"
                              >
                              </el-table-column>
                              <el-table-column
                                width="200"
                                prop="postName"
                                label="岗位"
                              >
                              </el-table-column>
                              <el-table-column
                                width="230"
                                :label="label"
                              >
                                <template slot-scope="scope">
                                  <el-input v-model="scope.row.candidateTime" :disabled="isGiveUp"></el-input>
                                </template>
                              </el-table-column>
                              <el-table-column
                                width="200"
                                label="原因"
                              >
                                <template slot-scope="scope">
                                  <el-input v-model="scope.row.candidateChangeReason" :disabled="!isGiveUp"></el-input>
                                </template>
                              </el-table-column>
                            </el-table>
            </el-col>
            <el-col style="text-indent: 1.5em;margin-top: 30px;margin-left: 10px;margin-bottom: 30px;">
              <p>周颖</p>
              <p>软件研发中心 人力资源部</p>
              <p><span>公司 : </span> <span>北京神州新桥科技有限公司</span></p>
              <p><span>地址 : </span><span>北京市海淀区长春桥路11号万柳亿城大厦2号楼16层</span></p>
              <p><span>邮箱 : </span><span>sinorjyfzx@sino-bridge.com</span></p>
              <p><span>电话 : </span><span>(+86)15962999175</span></p>
            </el-col>
            
            <el-col style="margin-bottom: 18px;">
              <el-row type="flex" justify="center">
                <el-col :span="23">
                  <div class="lightLine"></div>
                </el-col>
              </el-row>
            
            </el-col>
            
            <el-col>
            </el-col>
            <el-col>
              <div v-html="texthtml"></div>
            </el-col>
          </el-row>
        </div>
        <div slot="title" class="dialog-title">
          <el-button type="primary" :disabled="!sendEmailKey" @click="sendClick" style="font-size:16px;">
            <i class="iconfont icon-plane"></i>
            <span style="margin-left:6px;"> 发送</span>
          </el-button>
          <el-button @click="cancelSend">取 消</el-button>
          <el-input v-model="days" style="width:270px" placeholder="请输入需要寻找的天数内的发件箱主题"></el-input>
          
          <el-button type="primary" @click="getSendSub1">寻找收件箱</el-button>
          <el-button type="warning" @click="getSendSub">寻找发件箱</el-button>
          <el-button type="warning" @click="getallSendSub">寻找所有发件箱</el-button>
        
        </div>
      </el-dialog>
    </div>
  </div>
</template>
<script>
  
  import axios from 'axios'
  import qs from 'qs'
  import tagsView from '../../store/modules/tagsView'
  
  export default {
    name: 'telesolicit',
    data() {
      return {
        title: "面试邀约",
        inputValue: "",
        days: "",
        customerList: [],
        postCustomer: true,
        newcolor: false,
        newcolor1: false,
        jiaofu: true,
        newcolor2: false,
        isGiveUp: false,
        customername: "",
        times: "",
        sendTheme: "",
        loading: true,
        label: "修改后候选人面试时间",
        sendLoading: true,
        no: "",
        noList: [],
        time: "一面地点",
        dialogVisible: false,
        editTime: false,
        editdialogVisible: false,
        sendDialogVisible: false,
        dialogVisibleReason: false,
        dialogFormVisible: false,
        dialogPerfectVisible: false,
        editdialogNoVisible: false,
        giveDialogVisible: false,
        texthtml: "",
        remark: true,
        pickerOptions0: {
          disabledDate(time) {
            return time.getTime() < Date.now() - 8.64e7;//如果没有后面的-8.64e7就是不可以选择今天的
          }
        },
        maildata: [],
        sendEmailKey: true,
        theme: "",
        themeList: [],
        sendThemeList: [],
        typeList: [],
        mail: "",
        copymail: [],
        tableData: [],
        form: {
          customerTime: "",
          editReason: "客户修改面试时间"
        },
        formL: {
          area: "",
          imployerNames: "",
          phoneNum: "",
        },
        multipleSelection: [],
        currentPage: 1,
        pagesize: 15,
        totalcount: 0,
        rules: {
          customerTime: [
            {required: true, message: "请输入时间", trigger: "change"}
          ],
          editReason: [
            {required: true, message: "请输入原因", trigger: "blur"}
          ]
        },
        rulesL: {
          area: [
            {required: true, message: "请输入一面地点", trigger: "blur"}
          ]
        }
      }
    },
    created() {
      if (tagsView.state.identity == 7) {
        this.jiaofu = false;
      }
      this.success();
      axios.get(this.url + "/telesolicit/getassistantcustomernames")
        .then(res => {
          this.unlogin(res.data.code)
          if (res.data.code == 200) {
            this.customerList = res.data.data;
          }
        })
    },
    methods: {
      success() {
        axios.post(this.url + "/telesolicit/selecttelesolicitinfoforassistant", {
          type: this.times,
          id: this.customername,
          no: this.no,
          condition: this.inputValue,
          pageNum: this.currentPage,
          pageSize: this.pagesize
        })
          .then(res => {
            this.unlogin(res.data.code);
            if (res.data.code == 200) {
              this.tableData = res.data.data.list;
              this.totalcount = res.data.data.total;
              for (let i = 0, len = this.tableData.length; i < len; i++) {
                if (this.tableData[i].candidateTime == "9999-1-01 00:00") {
                  this.tableData[i].candidateTime = "放弃面试"
                }
              }
            }
          })
      },
      searchMsg() {
        this.currentPage = 1;
        this.success();
      },
      //鼠标按下完善按钮
      perfectDown() {
        this.newcolor = true;
      },
      //点击按钮弹起
      perfectUp() {
        this.newcolor = false;
      },
      //鼠标按下修改按钮
      editdown() {
        this.newcolor1 = true;
      },
      //修改按钮弹起
      editup() {
        this.newcolor1 = false;
      },
      // 检查按钮按下
      sendDown() {
        this.newcolor2 = true;
      },
      // 检查按钮弹起
      sendUp() {
        this.newcolor2 = false;
      },
      // 完善按钮点击
      perfectSend() {
        if (this.multipleSelection.length == 0) {
          this.editdialogVisible = true;
          document.documentElement.style.overflow = "hidden";
        } else if (this.multipleSelection.length > 1) {
          this.sendDialogVisible = true;
          document.documentElement.style.overflow = "hidden";
        } else {
          this.dialogPerfectVisible = true;
          document.documentElement.style.overflow = "hidden";
        }
      },
      perfectPost(formName) {
        this.$refs[formName].validate(valid => {
          if (valid) {
            axios.post(this.url + "/telesolicit/perfecttime", {
              id: this.multipleSelection[0].id,
              location: this.formL.area,
              name: this.formL.imployerNames,
              phone: this.formL.phoneNum
            }).then(res => {
              this.unlogin(res.data.code);
              if (res.data.code == 200) {
                this.dialogPerfectVisible = false;
                document.documentElement.style.overflow = "hidden";
                this.$refs.singleTable.clearSelection();
                this.success();
                this.time = "一面地点"
              }
            })
          }
        })
      },
      cancelPerfect() {
        this.dialogPerfectVisible = false;
        document.documentElement.style.overflow = "auto";
        this.$refs.singleTable.clearSelection();
      },
      // 修改按钮点击
      editshow() {
        if (this.multipleSelection.length == 1) {
          this.dialogVisible = true;
          document.documentElement.style.overflow = 'hidden';
        } else if (this.multipleSelection.length > 1) {
          this.sendDialogVisible = true;
          document.documentElement.style.overflow = 'hidden';
        } else {
          this.editdialogVisible = true;
          document.documentElement.style.overflow = 'hidden';
        }
      },
      themeChange(val) {
        axios.post(this.url + "/mailreplay/getcontent", {
          sub: val
        }).then(res => {
          this.unlogin(res.data.code)
          if (res.data.code == 200) {
            this.texthtml = res.data.data
          }
        })
      },
      sendThemeChange(val) {
        this.theme = val
        axios.post(this.url + "/mailreplay/getSentcontent", {
          sub: val
        }).then(res => {
          this.unlogin(res.data.code)
          if (res.data.code == 200) {
            this.texthtml = res.data.data
          }
        })
      },
      giveCancel() {
        this.giveDialogVisible = false;
        document.documentElement.style.overflow = "auto";
        this.$refs.singleTable.clearSelection();
      },
      getSendSub1() {
        this.remark = true;
        this.loading = true;
        this.disabled = true;
        axios.post(this.url + '/mailreplay/getsub', {
          mail: this.mail,
          day: this.days
        }).then(res => {
          this.unlogin(res.data.code);
          if (res.data.code == 200) {
            this.themeList = res.data.data;
            this.loading = false;
            this.disabled = false;
          }
        })
      },
      getSendSub() {
        this.remark = false;
        this.sendLoading = true;
        axios.post(this.url + "/mailreplay/getSentsub", {
          mail: this.mail,
          day: this.days
        }).then(res => {
          this.unlogin(res.data.code);
          if (res.data.code == 200) {
            this.sendThemeList = res.data.data;
            this.sendLoading = false;
          }
        })
      },
      getallSendSub() {
        this.remark = false;
        this.sendLoading = true;
        axios.post(this.url + "/mailreplay/getAllSentsub", {
          mail: this.mail,
          day: this.days
        }).then(res => {
          this.unlogin(res.data.code);
          if (res.data.code == 200) {
            this.sendThemeList = res.data.data;
            this.sendLoading = false;
          }
        })
      },
      // 发送按钮点击
      sendBtnClick() {
        let arr = [];
        let isEditReason = true;
        this.days = '';
        for (let i = 0, leng = this.multipleSelection.length; i < leng; i++) {
          if (this.multipleSelection[i].candidateChangeReason == "") {
            isEditReason = false;
          }
        }
        if (isEditReason) {
          let bool = false;
          for (let i = 0, leng = this.multipleSelection.length; i < leng; i++) {
            if (this.multipleSelection[i].candidateTime == "放弃面试") {
              bool = true;
            }
          }
          if (this.multipleSelection.length > 0) {
            if (this.multipleSelection.length > 1 && bool) {
              this.giveDialogVisible = true;
              document.documentElement.style.overflow = "hidden"
            } else {
              this.loading = true;
              for (let i = 0, leng = this.multipleSelection.length; i < leng; i++) {
                arr.push(this.multipleSelection[i].no)
                if (this.multipleSelection[i].candidateTime == "放弃面试" || this.multipleSelection[i].candidateTime == "面试待定") {
                  this.isGiveUp = true
                }
              }
              axios.post(this.url + "/mailreplay/getmail", {
                arr: arr
              }).then(res => {
                this.unlogin(res.data.code)
                if (res.data.code == 200) {
                  this.mail = res.data.data.mail;
                  this.copymail = res.data.data.cc;
                  axios.post(this.url + "/mailreplay/getsub", {
                    mail: this.mail,
                    day: this.days
                  }).then(res => {
                    this.unlogin(res.data.code);
                    if (res.data.code == 200) {
                      this.themeList = res.data.data
                      this.loading = false
                    }
                  })
                } else if (res.data.code == -200 && res.data.message == "接口人邮箱不同！") {
                  this.editdialogNoVisible = true;
                  document.documentElement.style.overflow = 'hidden';
                }
              })
              this.dialogFormVisible = true;
              document.documentElement.style.overflow = "hidden";
            }
            
          } else {
            this.editdialogVisible = true;
            document.documentElement.style.overflow = "hidden";
          }
        } else {
          this.dialogVisibleReason = true;
          document.documentElement.style.overflow = "hidden";
        }
      },
      // 点击当前行
      handleSelectionChange(val) {
        this.multipleSelection = val;
        // 深拷贝
        this.maildata = JSON.parse(JSON.stringify(val));
      },
      handleSizeChange(val) {
        this.pagesize = val;
        this.success();
      },
      pagehandleCurrentChange(val) {
        this.currentPage = val;
        this.success();
      },
      // 修改面试时间对话框确定按钮点击
      editTimePost(formName) {
        this.$refs[formName].validate(valid => {
          if (valid) {
            axios.post(this.url + "/telesolicit/assistantchangetime", {
              id: this.multipleSelection[0].id,
              time: this.form.customerTime,
              reason: this.form.editReason
            }).then(res => {
              this.unlogin(res.data.code);
              if (res.data.code == 200) {
                this.dialogVisible = false;
                document.documentElement.style.overflow = 'auto';
                this.$refs.singleTable.clearSelection();
                this.$refs.formP.resetFields();
                this.success();
                if (this.times) {
                  this.time = this.times + "地点"
                } else {
                  this.time = "一面地点"
                }
              }
            })
          }
        })
        
      },
      // 修改面试时间对话框取消按钮点击
      cancelEdit() {
        this.dialogVisible = false;
        document.documentElement.style.overflow = 'auto';
        this.$refs.singleTable.clearSelection();
      },
      handleClose() {
        this.editdialogVisible = false;
        document.documentElement.style.overflow = 'auto';
      },
      confirm() {
        this.sendDialogVisible = false;
        document.documentElement.style.overflow = 'auto';
      },
      cancel() {
        this.sendDialogVisible = false;
        document.documentElement.style.overflow = 'auto';
      },
      getRowKey(row) {
        return row.id
      },
      // 选择客户改变
      customerChange(val) {
        this.postCustomer = false;
        let name = "";
        for (let i = 0, len = this.customerList.length; i < len; i++) {
          if (this.customerList[i].id == val) {
            name = this.customerList[i].name
          }
        }
        axios.post(this.url + "/telesolicit/getassistantrequirenoortype", qs.stringify({
          customerName: name
        })).then(res => {
          this.unlogin(res.data.code)
          if (res.data.code == 200) {
            this.noList = res.data.data
          }
        });
        if (this.times && this.no) {
          this.currentPage = 1;
          this.success();
        }
      },
      // 一面二面三面切换
      timesChange(val) {
        this.label = val + "面试时间"
        if (this.customername && this.no) {
          this.currentPage = 1;
          this.success();
        }
      },
      noChange(val) {
        this.times = "",
          axios.post(this.url + "/telesolicit/getassistantrequirenoortype", qs.stringify({
            No: val
          })).then(res => {
            this.unlogin(res.data.code)
            if (res.data.code == 200) {
              this.typeList = res.data.data
            }
          })
        if (this.customername && this.times) {
          this.currentPage = 1;
          this.success();
        }
      },
      // 取消发送邮件
      cancelSend() {
        this.dialogFormVisible = false;
        this.isGiveUp = false;
        this.loading = true;
        this.sendLoading = true;
        this.sendEmailKey = true;
        this.texthtml = "";
        this.theme = "";
        this.remark = true;
        document.documentElement.style.overflow = "auto";
        this.$refs.singleTable.clearSelection();
      },
      // 发送邮件
      sendClick() {
        let data = [];
        if (this.isGiveUp) {
          for (let i = 0; i < this.maildata.length; i++) {
            data.push({
              name: this.maildata[i].name,
              postname: this.maildata[i].postName,
              interviewTimeok: this.maildata[i].candidateTime,
              reason: this.maildata[i].candidateChangeReason,
              initialTime: this.maildata[i].initialTime
            })
          }
        } else {
          for (let i = 0; i < this.maildata.length; i++) {
            data.push({
              name: this.maildata[i].name,
              postname: this.maildata[i].postName,
              interviewTimeok: this.maildata[i].candidateTime,
              initialTime: this.maildata[i].initialTime
            })
          }
        }
        
        let id = [];
        for (let i = 0, leng = this.multipleSelection.length; i < leng; i++) {
          id.push(this.multipleSelection[i].id)
        }
        if (this.sendEmailKey) {
          this.sendEmailKey = false;
          axios.post(this.url + '/telesolicit/send', {
            id: id,
            to: this.mail,
            cc: this.copymail,
            sub: this.theme,
            content: this.texthtml,
            arr: data,
            customer: this.multipleSelection[0].customerName
          }).then(res => {
            this.unlogin(res.data.code);
            if (res.data.code == 200) {
              this.dialogFormVisible = false;
              document.documentElement.style.overflow = 'auto';
              this.$refs.singleTable.clearSelection();
              this.success();
              this.texthtml = "";
              this.theme = "";
              this.remark = true;
              this.loading = true;
              this.sendLoading = true;
              this.sendTheme = "";
              this.sendEmailKey = true;
              if (this.times) {
                this.time = this.times + "地点"
              } else {
                this.time = "一面地点"
              }
              ;
              this.isGiveUp = false;
            }
          })
        }
        
      },
      handleNoClose() {
        this.editdialogNoVisible = false;
        document.documentElement.style.overflow = "auto";
      },
      handleCloseR() {
        this.dialogVisibleReason = false;
        document.documentElement.style.overflow = "auto";
        this.$refs.singleTable.clearSelection();
      },
      tableRowClassName({row, rowIndex}) {
        if (row.candidateTime === row.customerTime) {
          return ""
        } else if (row.candidateTime !== row.customerTime) {
          return "color-row"
        } else {
          return ""
        }
      }
      
    },
    watch: {
      "inputValue": function (val) {
        if (val == "") {
          this.currentPage = 1;
          this.success();
          this.time = "一面地点"
        }
      },
      "times": function (val) {
        if (val == "一面" || val == "") {
          this.time = "一面地点"
        } else if (val == "二面") {
          this.time = "二面地点"
        } else {
          this.time = "三面地点"
        }
      },
    }
  }
</script>
<style scoped>
  .hand {
    color: #1099ff;
  }
  
  .title {
    background-color: #fff;
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    padding-left: 20px;
    margin-top: 6px;
    margin-bottom: 6px;
  }
  
  .posttable {
    min-height: 700px;
    background-color: #fff;
  }
  
  .active {
    background: linear-gradient(to bottom, #595dff 0%, #7073ff 100%);
  }
  
  .active1 {
    background: linear-gradient(to bottom, #1cf1e3 0%, #379b94 100%);
  }
  
  .active2 {
    background: linear-gradient(to bottom, #ff9600 0%, #d68300 100%);
  }
  
  .perfect {
    width: 65px;
    height: 28px;
    opacity: 0.86;
    color: #fff;
    background: linear-gradient(to bottom, #5696f8 0%, #143dea 100%);
    padding: 7px 15px !important;
  }
  
  .perfect:hover {
    color: #fff !important;
  }
  
  .edit {
    width: 65px;
    height: 28px;
    opacity: 0.86;
    color: #fff;
    background: linear-gradient(to bottom, #00cebf 0%, #009085 100%);
    padding: 7px 15px !important;
  }
  
  .edit:hover {
    color: #fff !important;
  }
  
  .send {
    width: 65px;
    height: 28px;
    opacity: 0.86;
    color: #fff;
    background: linear-gradient(to bottom, #ffbc1c 0%, #f69710 100%);
    padding: 7px 15px !important;
  }
  
  .send:hover {
    color: #fff !important;
  }
  
  .pager {
    width: 100%;
    overflow: hidden;
    position: relative;
    margin-top: 10px;
    margin-bottom: 10px;
  }
  
  .el-pagination {
    margin-left: 50%;
    transform: translateX(-50%);
  }
  
  .resumeLink {
    cursor: pointer;
    color: #1198ff;
    text-decoration: none;
  }
  
  
  .line {
    height: 1px;
    background-color: #c8c8c8;
    margin-top: 3px;
    margin-bottom: 20px;
  }
  
  .darkline {
    height: 1px;
    background-color: #4288c3;
    margin-top: 10px;
    margin-bottom: 20px;
  }
  
  .lightLine {
    height: 1px;
    background-color: #cccccc;
    margin-top: 10px;
    margin-bottom: 10px;
  }
  
  .msyy .mailtable {
    margin-top: 15px;
    margin-bottom: 15px;
    width: 100% !important;
  }
  
  @media screen and (min-width: 600px) and (max-width: 1200px) {
    .dialogBox {
      height: 400px;
      overflow-y: scroll;
      overflow-x: hidden;
    }
  }
  
  @media screen and (min-width: 1201px) and (max-width: 1400px) {
    .dialogBox {
      height: 400px;
      overflow-y: scroll;
      overflow-x: hidden;
    }
    
    /* .msyy .mailtable {
margin-top: 15px;
margin-bottom: 15px;
width: 81% !important;
} */
  }
  
  @media screen and (min-width: 1401px) and (max-width: 1500px) {
    .dialogBox {
      height: 400px;
      overflow-y: scroll;
      overflow-x: hidden;
    }
  }
  
  @media screen and (min-width: 1501px) and (max-width: 1700px) {
    .dialogBox {
      height: 400px;
      overflow-y: scroll;
      overflow-x: hidden;
    }
  }
  
  
  @media screen and (min-width: 1701px) and (max-width: 1800px) {
    .dialogBox {
      height: 600px;
      overflow-y: scroll;
      overflow-x: hidden;
    }
  }
  
  @media screen and (min-width: 1801px) and (max-width: 1920px) {
    .dialogBox {
      height: 600px;
      overflow-y: scroll;
      overflow-x: hidden;
    }
  }
  
  .tabletitle {
    margin-left: 20px;
    min-height: 50px;
    line-height: 50px;
  }
</style>
